<template>
	<div class="page motion">
		<x-header class='header' slot="header" :left-options="{backText: ''}">运动指导</x-header>
		<div class="top" style="height: 50px; width: 100%;"></div>
		<view-box>
			<div v-for="item in sport_guidance">
				<group title="运动建议" title-color='#000' class='asd'>
					<cell :value="item.sportCategory">
						<span slot="title" class="ospan">运动方式</span>
					</cell>
					<cell :value="item.sportDose">
						<span slot="title" class="ospan">运动强度</span>
					</cell>
					<cell :value="item.sportTime + '分钟'">
						<span slot="title" class="ospan">运动时间</span>
					</cell>
					<cell :value="item.sportFrequency + 'km/h'">
						<span slot="title" class="ospan">运动频率</span>
					</cell>
					<cell :value="item.consumeGoal + '千卡'">
						<span slot="title" class="ospan">能耗目标</span>
					</cell>
					<cell :title="item.note" value="" style='padding: 10px 15px 15px 15px;font-size: 14px;color:rgb(102,102,102)'></cell>
		
				</group>
				
			</div>
		
		</view-box>
		

	</div>
</template>

<script>
	import Api from '@/api/index.js' //  引入api文件
	export default {
		data() {
			return {
				customer_id: '',
				sport_guidance: []
			}
		},
		created() {
			this.customer_id = localStorage.getItem('customer_id');
			this.getData();
		},
		methods: {
			getData(){   // GET /improve/sport_guidance/{customer_id}
				const sport_guidanceApi = Api.sport_guidanceApi + this.customer_id; //  运动指导
				this.$http.get(sport_guidanceApi)
				.then(({data})=>{
					this.sport_guidance = data.data;
					console.log(data)
				})
				.catch((err)=>{
					console.log(err)
				})
			}
		}
	}
	
	
</script>

<style lang="less" scoped>
	.motion {
		position: fixed !important;
		left: 0;
		top: 0;
		right: 0;
		background: #fff;
		z-index: 999;
		width: 100%;
		height: 100%;
		overflow: hidden;
		.ospan {
			color: rgb(58, 175, 252);
		}
	}
</style>